<template>
  <el-dialog
    title="添加数据字典"
    width="70%"
    :append-to-body="true"
    :visible.sync="showTag"
  >
    <el-row>
      <el-col :span="8">
        <div class="fs16 mb10">选择父节点</div>
        <el-tree
          v-if="showTag"
          ref="tree"
          lazy
          check-strictly
          show-checkbox
          :load="load"
          :default-checked-keys="[form.fid]"
          node-key="id"
          :props="{ label: 'name', children: 'children', isLeaf: 'isLeaf' }"
        ></el-tree>
      </el-col>
      <el-col :span="16">
        <el-form :model="form" label-width="80px" size="mini">
          <el-form-item label="名称">
            <el-input v-model="form.name"></el-input>
          </el-form-item>
          <el-form-item label="排序">
            <el-input v-model="form.sort"></el-input>
          </el-form-item>
          <el-form-item label="Key">
            <el-input v-model="form.key"></el-input>
          </el-form-item>
          <el-form-item label="value">
            <el-input v-model="form.value"></el-input>
          </el-form-item>
        </el-form>
      </el-col>
    </el-row>
    <div slot="footer">
      <el-button size="mini" @click="hide">
        取消
      </el-button>
      <el-button type="primary" :loading="appLoading" size="mini" @click="sub">
        确定
      </el-button>
    </div>
  </el-dialog>
</template>

<script>
import { CONFIG_TYPE } from "../../lib/config";
import { AppLoadingMixin } from "../../lib/mixins/app-loading";
import { FIELDS } from "../../lib/tables/coclass";

export default {
  name: "CoclassAddDialog",
  mixins: [AppLoadingMixin],
  data() {
    return {
      form: {},
      data: [
        {
          name: "顶级",
          id: 0
        }
      ],
      info: {},
      types: CONFIG_TYPE,
      showTag: false
    };
  },
  methods: {
    show(data) {
      this.info = data;
      this.setForm();
      this.showTag = true;
    },
    hide() {
      this.resetForm();
      this.showTag = false;
    },
    setForm() {
      const { info } = this;
      FIELDS.forEach(r => {
        info && info[r] && this.$set(this.form, r, info[r]);
      });
    },
    resetForm() {
      FIELDS.forEach(r => {
        this.$set(this.form, r, null);
      });
    },
    async load(node, resolve) {
      let list = [];
      if (node.level === 0) {
        list = [{ name: "顶级", fid: 0, isLeaf: true }];
      }
      const data = await this.$coclassService.list({
        fid: (node.data && node.data.id) || 0,
        pageSize: 10000
      });
      list = list.concat(data.data);
      resolve(list);
    },
    async sub() {
      const form = { ...this.form };
      const fids = this.$refs.tree.getCheckedKeys();
      if (fids.length === 0) return this.$message.error("请选择父节点");
      if (fids.length > 1) return this.$message.error("只能选择一个父节点");

      form.fid = fids[0];

      if (form.id) {
        if (await this.$coclassService.update(form)) {
          this.hide();
          this.$message.success("修改成功");
          this.$emit("ok");
        }
        return;
      }

      if (await this.$coclassService.add(form)) {
        this.hide();
        this.$message.success("添加成功");
        this.$emit("ok");
      }
    }
  }
};
</script>

<style scoped></style>
